.et-nav-bar {
  position: fixed;
  right: auto;
  left: 0;
  top: 0;
  z-index: 100;
  width: $et-nav-width;
  background-color: $et-nav-1st-bg;
  display: block;
  height: 100%;
  transition: all 0.2s;
}

.et-nav-wrap {

  height: 100%;
  padding-bottom: 4rem;

  li {
    position: relative;
    & > a {
      @include et-menu-item-padding(1.25rem, 0);
      display: block;
      width: 100%;
      text-align: center;
      position: relative;
      color: $et-nav-txt;

      &[data-has-children]:after {
        @include et-submenu-arrow(40%);
      }

      &:hover {
        @include et-color-setting($et-nav-txt-hover, $et-nav-hover-bg);
      }

      & > i {
        display:block;
        width:100%;
        @include et-nav-icon($et-nav-icon-size, 0.5rem);
      }
    }
  }

  .menu.nested {
    margin: 0;
    @include et-submenu-shadow;
  }

  ul.menu-2 {
     li {
       & > a[data-has-children]:after {
         content: $et-nav-has-child-icon;
         top: 1rem;
       }
     }
     background-color: $et-nav-2nd-bg;
     a {
       @include et-menu-item-padding(1.25rem, 0);
     }
  }

  li[aria-expanded="true"] {
    & > a:after {
      transform: rotate(90deg);
      transition: all 0.2s;
    }
  }

  ul.menu-3 {
    background-color: $et-nav-3rd-bg;
  }

}
